<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="Keywords" content="">
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <meta content="width=640,target-densitydpi=device-dpi,user-scalable=no" name="viewport">
        <link href="css/style.css" rel="stylesheet" type="text/css">
        <link href="css/style.css" rel="stylesheet" type="text/css">
        <script type="text/javascript" src="js/jquery-1.11.2.js"></script>
        <title>华硕</title>
    </head>
    <body>
        <div class="main">
            
<!--首页-->
            <div class="page index rule">
                <header>
                    <div class="logo left">
                        <img src="images/logo.png">
                    </div>
                    <div class="header_right right">
                        <img src="images/header_right.png">
                    </div>
                </header>
                <div class="rank_con">
                    <p class="rank_title">活动排行</p>
                    <div class="rank_content">
                        
                        <ul class="rank_list_title">
                            <li class="on">速度值<span></span></li>
                            <li>点赞数<span></span></li>
                            <li>能量值<span></span></li>
                            <li>帅气值<span></span></li>
                        </ul>
                        <div class="clear"></div>
                        <div class="rank_list">
                            <ul style="display:block;">
                                <li><span class="red">1</span>我是一支小小鸟1</li>
                                <li><span>2</span>我是一支小小鸟1</li>
                                <li><span>3</span>我是一支小小鸟1</li>
                                <li><span>4</span>我是一支小小鸟1</li>
                                <li><span>5</span>我是一支小小鸟1</li>
                                <li><span>5</span>我是一支小小鸟1</li>
                                <li><span>5</span>我是一支小小鸟1</li>
                                <li><span>5</span>我是一支小小鸟1</li>
                                <li><span>5</span>我是一支小小鸟1</li>
                                <li><span>5</span>我是一支小小鸟1</li>
                            </ul>
                            <div class="clear"></div>
                             <ul>
                                <li><span class="red">1</span>我是一支小小鸟2</li>
                                <li><span>2</span>我是一支小小鸟2</li>
                                <li><span>3</span>我是一支小小鸟2</li>
                                <li><span>4</span>我是一支小小鸟2</li>
                                <li><span>5</span>我是一支小小鸟2</li>
                                <li><span>5</span>我是一支小小鸟2</li>
                                <li><span>5</span>我是一支小小鸟2</li>
                                <li><span>5</span>我是一支小小鸟2</li>
                                <li><span>5</span>我是一支小小鸟2</li>
                                <li><span>5</span>我是一支小小鸟2</li>
                            </ul>
                            <div class="clear"></div>
                             <ul>
                                <li><span class="red">1</span>我是一支小小鸟</li>
                                <li><span>2</span>我是一支小小鸟3</li>
                                <li><span>3</span>我是一支小小鸟3</li>
                                <li><span>4</span>我是一支小小鸟3</li>
                                <li><span>5</span>我是一支小小鸟3</li>
                                <li><span>5</span>我是一支小小鸟3</li>
                                <li><span>5</span>我是一支小小鸟3</li>
                                <li><span>5</span>我是一支小小鸟3</li>
                                <li><span>5</span>我是一支小小鸟3</li>
                                <li><span>5</span>我是一支小小鸟3</li>
                            </ul>
                            <div class="clear"></div>
                             <ul>
                                <li><span class="red">1</span>我是一支小小鸟</li>
                                <li><span>2</span>我是一支小小鸟4</li>
                                <li><span>3</span>我是一支小小鸟4</li>
                                <li><span>4</span>我是一支小小鸟4</li>
                                <li><span>5</span>我是一支小小鸟4</li>
                                <li><span>5</span>我是一支小小鸟4</li>
                                <li><span>5</span>我是一支小小鸟4</li>
                                <li><span>5</span>我是一支小小鸟4</li>
                                <li><span>5</span>我是一支小小鸟4</li>
                                <li><span>5</span>我是一支小小鸟4</li>
                            </ul>
                            <div class="clear"></div>
                        </div>
                    
                    </div>
                    
                </div>
                
            </div>
        </div>
        <script type="text/javascript">
                            $(".rank_list_title li").click(function(){
                                $(this).addClass("on").siblings("li").removeClass("on");
                                var index = $(this).index();
                                $(".rank_list ul").eq(index).show().siblings("ul").hide();
                            });
                        </script>
    </body>
</html>